---
layout: photo
title: "校园图片影集"
permalink: /html/photo.html
---

<style>
.container { width: initial; }
.content { max-width: initial; }
.grid::after {
    content: '';
    display: block;
    clear: both;
}
.grid-item {
    float: left;
    width: 250px;
    margin-bottom: 10px;
}
.grid-size {
    width: 250px;
}
@media (max-width: 48em) {
    .grid-item,
    .grid-size {
        width: calc(50% - 10px);
    }
}
.grid-item a {
    display: block;
    width: 100%;
}
.grid-item img {
    width:240px;
    cursor: pointer;
    margin: 0;
    transition: .3s ease;
}
.grid-item a:hover {
    border-bottom: none;
}
</style>

<div class="page">
    <h1 class="page-title">校园影集</h1>
    <div class="grid">
        <div class="grid-size"></div>
        <!-- Add new photo from here -->
        <div class="grid-item">
            <img src="http://file.zhiniao66.com/Uploads/245/cloudFile/2019_06_06/1092_E0CA575A-295D-6DA7-2670-9FFC43715DB00.jpg">
        </div>
        <div class="grid-item">
            <img src="http://file.zhiniao66.com/Uploads/245/cloudFile/2019_06_06/1092_73E16F0E-2F49-5F9F-7EC2-7C3D766C50E70.jpg">
        </div>
        <div class="grid-item">
            <img src="http://file.zhiniao66.com/Uploads/245/cloudFile/2019_06_06/1092_7528C603-2C65-1B7B-127F-97699610C0500.jpg">
        </div>
        <div class="grid-item">
            <img src="http://file.zhiniao66.com/Uploads/245/cloudFile/2019_06_06/1092_FA7D8BC4-F127-0C8B-2A1D-D253BE34B33E0.jpg">
        </div>
        <div class="grid-item">
            <img src="http://file.zhiniao66.com/Uploads/245/cloudFile/2019_06_06/1092_955CF24C-AA53-970F-2276-932E051A15E50.jpg">
        </div>
        <div class="grid-item">
            <img src="http://file.zhiniao66.com/Uploads/245/cloudFile/2019_06_06/1092_50CE0E1E-78B2-311B-D704-C4AAA918A30F0.jpg">
        </div>
        <div class="grid-item">
            <img src="http://file.zhiniao66.com/Uploads/245/cloudFile/2019_06_06/1092_15690778-B3DC-49E8-5C65-015CC808B0520.jpg">
        </div>
        <div class="grid-item">
            <img src="http://file.zhiniao66.com/Uploads/245/cloudFile/2019_06_06/1092_BF81D80C-B2BE-ABC9-AB69-6118E1C1518D0.jpg">
        </div>
    </div>
</div>

<link rel="stylesheet" href="/public/viewer/viewer.min.css">
<script type="text/javascript" src="/public/js/jquery-3.4.1.min.js"></script>
<script type="text/javascript" src="/public/viewer/viewer.min.js"></script>
<script type="text/javascript">
    $("div.grid").viewer({title:0});//创建视图
</script>
